import { zhCN } from 'date-fns/locale/zh-CN';
import { registerLocale } from 'react-datepicker';
registerLocale('zhCN', zhCN);

// import "react-datepicker/dist/react-datepicker.css";

// CSS Modules, react-datepicker-cssmodules.css
// import 'react-datepicker/dist/react-datepicker-cssmodules.css';

import BaseBarLineChart from '@/components/BaseBarLineChart';
import { ContentCard } from '@/page-components';
import { useModel } from '@umijs/max';
import { Col, Flex } from 'antd';
import './cssModule.less';
import './index.less';

const Example = () => {
  // const [selectedDates, setSelectedDates] = useState([new Date()]);
  const {
    initialState: { userInfo },
  } = useModel('@@initialState');
  console.log(userInfo, 'model');

  // const onChange = (dates: any) => {
  //   setSelectedDates(dates);
  // };

  return (
    <>
      <div className="mb-[20px]">
        <div className="font-[700] text-[18px] mb-[10px]">欢迎使用!</div>
        <div> {userInfo?.name}</div>
      </div>
      <Flex gap={10}>
        <Col span={12}>
          <ContentCard>
            <BaseBarLineChart chartType="line" />
          </ContentCard>
        </Col>
        <Col span={12}>
          <ContentCard>
          <BaseBarLineChart chartType="bar" />
          </ContentCard>
        </Col>
      </Flex>
    </>
  );
};
export default Example;
{
  /* <DatePicker
          selectedDates={selectedDates}
          selectsMultiple
          onChange={onChange}
          shouldCloseOnSelect={false}
          disabledKeyboardNavigation
          locale={'zhCN'}
        /> */
}
